<template>
  <!--  监控概况  -->
  <basic-container>
    <avue-data-cardtext :option="option" @row-click="tip" ></avue-data-cardtext>
    <el-dialog :visible.sync="monitor" width="70%" height="100%">
      <iframe  id="iframe"  width="100%" height="600" frameborder="0"
               :src="monitorUrl" ></iframe>
    </el-dialog>
</basic-container>
</template>

<script>
  import {getList} from "@/api/desk/monitor";

  export default {
    data(){
      return {
        // query: {
        //   descs: 'update_time',
        // },
        monitor: false,
        monitorUrl: "",
        option: {
          span:4,
          height:20,
          gutter:4,
          data: [],
        },
      }
    },
    mounted() {
      getList(1, 999, this.query).then(res => {
        const data = res.data.data.records
        for (const re of data) {
          re.title=re.monitorName
          re.content=re.monitorDescription
          // re.href=re.monitorUrl.replaceAll('&amp;','&')
          // re.target='_blank'
          re.date=re.updateTime
          re.name='主机状态',
          re.color='green',
          re.icon='el-icon-mobile-phone',
          // re.icon='',
          re.click=(item)=>{
            this.monitorUrl=""
            if (item.monitorUrl!==""){
              this.monitorUrl=item.monitorUrl.replaceAll('&amp;','&')
              this.monitor=true
            }
          }
        }
        this.option.data=data
      });
    },
  }
</script>
